import React from 'react';
import { render, screen } from '@testing-library/react';
import '@testing-library/jest-dom';
import Profile from '../components/Profile';
import { useAuth0 } from "@auth0/auth0-react";

jest.mock("@auth0/auth0-react");

describe('Profile Component', () => {
    beforeEach(() => {
        useAuth0.mockReturnValue({
            user: {
                name: 'John Doe',
                picture: 'https://example.com/avatar.jpg',
                email: 'johndoe@example.com',
                sub: 'auth0|1234567890',
                email_verified: true
            }
        });
    });

    test('renders user information correctly', () => {
        render(<Profile />);
        expect(screen.getByText('John Doe')).toBeInTheDocument();
        expect(screen.getByAltText('profile avatar')).toHaveAttribute('src', 'https://example.com/avatar.jpg');
        expect(screen.getByText('johndoe@example.com')).toBeInTheDocument();
        expect(screen.getByText('auth0|1234567890')).toBeInTheDocument();
        expect(screen.getByText('true')).toBeInTheDocument();
    });

    // Here you can add more tests, such as testing conditional rendering
    // or handling different user states.
});